<template>
  <div class="app_content_container">
    <Breadcrumb :items="['快照']" />
    <BaseTable
      ref="baseTableRef"
      :apiUrl="getSnapshotList"
      :columns="columns"
      placeholder="请输入快照名称"
      :isShowAddBtn="false"
      height="calc(100vh - 180px)"
    >
      <!-- isRowSelection
      @handleSelectionChange="(val) => (selectedKeys = val)" -->
      <!-- <template #operatBtns>
        <ga-button
          :type="isdisable ? 'secondary' : 'primary'"
          status="danger"
          :disabled="isdisable"
          style="margin-left: 8px"
          @click="handleDelete(selectedKeys)"
        >
          删除
        </ga-button>
      </template> -->
      <template #action="{ record }">
        <ga-link @click="handleRollback(record)">还原</ga-link>
        <ga-link status="danger" @click="handleDelete(record)">删除</ga-link>
      </template>
    </BaseTable>
  </div>
</template>

<script setup>
import { ref, computed } from "vue";
import { columns } from "./columns";
import { getSnapshotList, deleteSnapshot, rollbackSnapshot } from "@/api/snapshot";
import { deleteModalWithRefresh, warningModal } from "@/hooks/useWarningModal";

const selectedKeys = ref([]);
const visible = ref(true);
const isdisable = computed(() => selectedKeys.value?.length === 0);
// 删除方法
const baseTableRef = ref(null);
// 删除方法
const handleDelete = (record) => {
  deleteModalWithRefresh(record, deleteSnapshot, () => baseTableRef.value.fetchData());
};
const handleRollback = async (record) => {
  warningModal(`确定要还原快照吗`, async () => {
    try {
      await rollbackSnapshot(record?.id, { snapshotId: id });
      Message.success("操作成功");
      baseTableRef.value.fetchData();
    } catch (err) {
      console.log(err);
    }
  });
};
// const handleDelete = async (records) => {
//   const ids = records.map((item) => ({ id: item?.id ? item.id : item }));
//   warningModal(`确定要删除数据吗`, async () => {
//     try {
//       await deleteLabel(ids);
//       Message.success("操作成功");
//       baseTableRef.value.fetchData();
//     } catch (err) {
//       console.log(err);
//     }
//   });
// };
</script>

<style lang="scss" scoped></style>
